/* http://meyerweb.com/eric/tools/css/reset/
 *    v2.0 | 20110126
 *       License: none (public domain)
 *       */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

html { font-size: 100%; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;  min-height:100%; -webkit-tap-highlight-color:transparent; height: 100%; overflow: hidden;}
body { color:#666; position: relative; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased;   font-family:'Open Sans','Microsoft YaHei';min-height:100%; -webkit-tap-highlight-color:transparent;}

body{ }
a {text-decoration: none;color: #666; background-color: transparent; }
p, a { -ms-word-wrap: break-word; word-wrap: break-word; }
a,button{border:none;-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;outline:none;}
.fl {float:left!important;}
.fr {float:right!important;}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}
.clearfix{overflow:hidden;_zoom:1;clear:both;}

.container_1200{ width:1200px; margin:0px auto; overflow:hidden; position:relative;}
.containern_1200{ width:1200px; margin:0px auto; position:relative;}
.container{  margin:0px 16px; overflow:hidden; position:relative;}
.containern{  margin:0px 16px; position:relative;}
.container88{ width:88%; margin:0px auto; overflow:hidden; position:relative;}
.pc{ display:block!important;}
.wap{ display:none!important;}

main{ position: relative; z-index: 0;
}
article{ 		}
$tr4 : all .4s,transform .4s;
.pageinner{/*padding:64px 0 60px;*/ position:relative;min-height:430px;}

.text-hidden{ display:block;white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/*水平垂直居中*/
.wh-center{display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center; -ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}
/*垂直居中*/
.h-center{display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}
/*分组父级*/
.felx-box{ display: -webkit-box;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-webkit-box-pack: justify;-webkit-box-align: center;display: flex;flex-flow: row nowrap;align-items: left;}
/*分组子级*/
.felx-item{-webkit-box-flex: 1;flex-basis: 1;flex-grow: 1;flex-shrink: 1; flex: 1 1 1;}


  #laad {
      height: 150px;
      width: 150px;
      position: absolute;
      top: 50%;
      left: 50%;
      margin-top: -75px;
      margin-left: -75px;
  }
  #caseBlanche {
      position: relative;
      height: 150px;
      width: 150px;
      margin: 0 auto;
  }
  #rond {
      height: 100px;
      width: 100px;
      border: 1px solid #e01e12;
      border-radius: 50%;
      position: absolute;
      top: 19px;
      left: 19px;
      animation: rond 2s infinite;
      -webkit-animation: rond 2s infinite;
      margin: 5px;
  }
  #test {
      height: 10px;
      width: 10px;
      position: absolute;
      background-color: #e01e12;
      border-radius: 50%;
      top: 0;
      left: 10px;
      margin: 5px;
  }
  #caseBlanche #load {
      color: #fff;
      font-family: calibri;
      text-align: center;
      position: absolute;
      top: 40px;
      left: 40px;
      width: 70px;
      height: 70px;
  }
  #caseBlanche #load img {
      display: block;
      width: 100%;
  }
  @keyframes rond {
      0% {
          transform: rotate(0deg);
      }
      100% {
          transform: rotate(360deg);
      }
  }
  @-webkit-keyframes rond {
      0% {
          -webkit-transform: rotate(0deg);
      }
      100% {
          -webkit-transform: rotate(360deg);
      }
  }
.page{
  ul{ overflow: hidden;
    li { margin: 0 3px 0 0 !important; padding: 0 !important; display: inline-block; float: left;
      &:before { content: ''; display: none; padding: 0; }
      a { border: 1px solid #d9d6d6; text-align: center; line-height: 36px; width: 36px; height: 36px; color: #46434e; font-size: 16px; font-weight: normal; display: block; transition: $tr4;
        &.a { background: #cdcbd3; text-align: center; line-height: 36px; width: 36px; height: 36px; color: #46434e; font-size: 13px; font-weight: normal; display: block; }
        &:hover { color: #d1a161; transition: $tr4; }
        &.current { background: #d1a161; color: #fff; }
        span.btn_prev { display: none; }
        span.btn_next { display: none; }
      }
    }
  }
}

/* alert_player */
.alert_player { position:fixed; top:0; width:100%;height:100%;z-index:99999999;}
.alert_player .bg { width:100%; height:100%; position:absolute; top:0; left:0; background:rgba(0,0,0,.7); }
.alert_player .layer { width:350px; height:120px; position:absolute; margin:0 0 0 -150px;left:50%; top:200px; background:#fff; border-radius:10px; text-align:center; }
.alert_player .info { height:50%; line-height:360%; border-bottom:1px solid #ccc; }
.alert_player .queren_btn { background:#1ba9fb; display:inline-block; padding:14px 60px; margin:5px 0 0 0; color:#fff; border-radius:10px; }


#progress {
    position:fixed;
    height: 2px;
    top: 0;
    background:#32BACA;
    transition:opacity 500ms linear; z-index: 99999;
}
#progress.done {
    opacity:0
}
#progress span {
    position:absolute;
    height:2px;
    -webkit-box-shadow:#32BACA 1px 0 6px 1px;
    -webkit-border-radius:100%;
    opacity:1;
    width:150px;
    right:-10px;
    -webkit-animation:pulse 4s ease-out 0s infinite;
}

@-webkit-keyframes pulse {
    30% {
        opacity:.6
    }
    60% {
        opacity:0;
    }
    100% {
        opacity:.6
    }
}
.backtotop{ width: 54px; height: 54px; background: url(../images/backtotop.png); position: fixed; bottom: 50px; right: 10px; border-radius: 5px; transition: $tr4; display: none;
a{ display: block; width: 54px; height: 54px; }
  &:hover{ box-shadow: 0 0 5px #2481bb; transition: $tr4; }
}

.page-main{ position: relative; margin-top: -20px; z-index:99; overflow: hidden;
  aside{ width: 213px; border: 1px solid #e5e5e5; padding-bottom: 3000px; margin-bottom: -3000px;
    .tit{ height: 78px; background: #00a4e3; color: #fff; font-weight: bold; font-size: 24px; padding-left: 33px; line-height: 92px; border-bottom: 1px solid #fff; }
    ul{
      li{
        a{ display: block; height: 65px; line-height: 65px; border-bottom: 1px solid #e3e3e3; position: relative; padding-left: 58px; transition: $tr4; color: #585858;
          &.on{ color: #fff; background: #00a4e3; border-bottom: 1px solid #fff;
            &::before{ display: block; width: 7px; height: 14px; content: ""; background: #fff; position:absolute; top: 50%; margin-top: -7px; left: 36px; }
          }
          &:hover{ color: #fff; background: #00a4e3; border-bottom: 1px solid #fff; transition: $tr4; }
        }
      }
    }
    .a-contact{ width: 138px; padding:0 37px; margin-bottom: 40px;
      .tel{
        .a-tit{ color: #585858; padding-left: 30px; background: url(../images/a_tel.png) no-repeat left center; height: 21px; line-height: 21px; margin-top: 35px; margin-bottom: 5px; }
        .inner{font-family: Impact, Charcoal, sans-serif; font-size: 24px; }
      }
      .qq{ height: 48px; background: #00a4e3; font-weight: bold; margin-top: 20px;
        a{ color: #fff; display: block; height: 48px; line-height: 48px; padding-left: 50px; background: url(../images/qq.png) 22px center no-repeat; }
      }
      .erw{ margin-top: 17px; font-size: 12px; color: #585858; text-align: center; line-height: 40px;
        img{ display: block; width: 100%; }
      }
    }
  }
  .right{ padding: 20px 0px 20px 60px; width: 920px;
    &.whole{ padding: 20px 0; width: 100%;}
    .position{ line-height: 54px; color: #b5b5b5; font-size: 12px; background: url(../images/pin.png) no-repeat left center; padding-left: 10px;
      a{ color: #b5b5b5; display: inline-block; margin: 0 20px; }
    }
    .page{ text-align: center;
      a{ text-align: center; display: inline-block; height: 30px; line-height: 30px; color: #828282; margin: 0 2px;
        &.num{ width: 28px; background: #e4e4e4;
          &.on{ color: #fff; background: #00a0e9; }
        }
        .next{ padding: 0 7px; }
      }
    }

    .shangxia{ border-top: 1px solid #d2d2d2; padding-top: 30px;
      a{display: block; font-size: 14px; line-height: 36px;
        span{ color: #000000;}
      }
    }
  }
}
